 <!DOCTYPE html>
 <html lang="en">
 <head>
 	<title>垂直边距合并</title>
 	<meta charset="utf-8">
 	<style type="text/css">
 		.box{
 			width: 500px;
 			/* height:  */
 			border: 1px solid #000;
			margin:50px auto 0;
			margin-top: 20px;
 		}
 		.box div{
/*  			margin-left: 20px;
margin-right: 20px;
margin-top: 20px;
margin-bottom: 20px; */
 			margin:20px;
 		}

 	</style>


 </head>
 <body>
	<div class="box">		
		<div>外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。</div>
		<div>外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。</div>
		<div>外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。</div>
		<div>外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。</div>
	</div>
 
 </body>
 </html>